<div class="table-stacked">
  <table class="table-list w-full my-4">
    <thead>
      <tr>
        <th><%= t("decidim.admin.taxonomy_filters.table.name") %></th>
        <th><%= t("decidim.admin.taxonomy_filters.table.internal_name") %></th>
        <th class="w-16"><%= t("decidim.admin.taxonomy_filters.table.actions") %></th>
      </tr>
    </thead>
    <tbody>
      <% component.available_taxonomy_filters.each do |taxonomy_filter| %>
        <%= hidden_field_tag(field_name, taxonomy_filter.id) %>
        <tr>
          <td data-label="<%= t("decidim.admin.taxonomy_filters.table.name") %>">
            <%= taxonomy_filter.translated_name %>
          </td>
          <td data-label="<%= t("decidim.admin.taxonomy_filters.table.internal_name") %>">
            <%= taxonomy_filter.translated_internal_name %>
          </td>
          <td data-label="<%= t("decidim.admin.taxonomy_filters.table.actions") %>" class="table-list__actions">
            <button type="button" data-controller="dropdown" data-target="taxonomy-filter-actions-<%= taxonomy_filter.id %>" aria-label="<%= t("decidim.admin.actions.actions_label", resource: taxonomy_filter.translated_name ) %>">
              <%= icon "more-fill", class: "text-secondary" %>
            </button>

            <div class="inline-block relative">
              <ul id="taxonomy-filter-actions-<%= taxonomy_filter.id %>" class="dropdown dropdown__action" aria-hidden="true">
                <li class="dropdown__item">
                  <%= link_to decidim_admin.taxonomy_filters_selector_path( component_id: component.id, taxonomy_id: taxonomy_filter.root_taxonomy_id, taxonomy_filter_id: taxonomy_filter.id ), class: "dropdown__button js-edit-taxonomy-filter", data: { drawer: "taxonomy_filters-dialog" } do %>
                    <%= icon "pencil-line" %>
                    <%= t("decidim.admin.taxonomy_filters.table.edit") %>
                  <% end %>
                </li>
              </ul>
            </div>
          </td>
        </tr>
      <% end %>
    </tbody>
  </table>
</div>
